// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.

import React from 'react';

type SvgProps = {
    width: number;
    height: number;
}

const PaymentFailedSvg = ({width, height}: SvgProps) => (
    <svg
        width={width ? width.toString() : '319'}
        height={height ? height.toString() : '260'}
        viewBox='0 0 319 260'
        fill='none'
        xmlns='http://www.w3.org/2000/svg'
    >
        <g clipPath='url(#clip_payment_failed)'>
            <path
                d='M23.3084 212.009H234.816C236.372 211.987 237.857 211.35 238.944 210.236C240.031 209.123 240.633 207.624 240.618 206.068V64.7859C240.633 63.2299 240.031 61.7311 238.944 60.6177C237.857 59.5042 236.372 58.8668 234.816 58.845H23.3084C21.7528 58.869 20.2697 59.5071 19.1829 60.62C18.096 61.733 17.4936 63.2305 17.5069 64.7859V206.076C17.4958 207.63 18.0992 209.125 19.1858 210.237C20.2724 211.348 21.7542 211.985 23.3084 212.009Z'
                fill='#24262E'
            />
            <path
                d='M0.5 232.757C0.5 239.883 6.30153 247.008 13.338 247.008H244.67C251.301 247.008 257.5 239.899 257.5 232.757H0.5Z'
                fill='#24262E'
            />
            <path
                d='M236.084 212.009H21.916L0.5 232.756H257.5L236.084 212.009Z'
                fill='#D1D4DB'
            />
            <path
                d='M229.006 213.658H29.118L21.9821 222.383H236.15L229.006 213.658Z'
                fill='#AFB3C0'
            />
            <path
                d='M151.042 226.219H107.091L103.792 230.578H154.332L151.042 226.219Z'
                fill='#24262E'
            />
            <path
                d='M227.581 71.7463H30.5519V199.108H227.581V71.7463Z'
                fill='#DDDFE4'
            />
            <path
                d='M157.63 117.352L149.506 109.225L129.185 129.55L108.864 109.225L100.73 117.352L121.051 137.685L100.73 158.009L108.864 166.135L129.185 145.811L149.506 166.135L157.63 158.009L137.309 137.685L157.63 117.352Z'
                fill='#C43133'
            />
            <path
                d='M129.062 62.1509C129.718 62.1509 130.359 62.3453 130.904 62.7095C131.449 63.0736 131.874 63.5913 132.125 64.1969C132.376 64.8025 132.441 65.4689 132.313 66.1118C132.186 66.7547 131.87 67.3453 131.406 67.8088C130.943 68.2723 130.352 68.588 129.709 68.7159C129.066 68.8438 128.399 68.7781 127.793 68.5272C127.188 68.2764 126.67 67.8516 126.306 67.3066C125.941 66.7615 125.747 66.1207 125.747 65.4652C125.747 64.5862 126.096 63.7432 126.718 63.1216C127.34 62.5001 128.183 62.1509 129.062 62.1509Z'
                fill='#DDDFE4'
            />
            <path
                d='M147.495 242.037H110.514C109.238 242.037 105.864 242.037 105.864 237.728H152.169C152.169 242.037 148.696 242.037 147.495 242.037Z'
                fill='#3F4350'
            />
        </g>
        <path
            d='M315.265 116.114C318.832 119.674 319.567 125.07 316.879 128.194L254.577 200.63C250.796 205.03 244.164 205.147 239.856 200.832L186.671 147.636C182.35 143.314 182.474 136.694 186.867 132.913L259.302 70.6175C262.426 67.9359 267.815 68.6649 271.381 72.2382L315.265 116.114Z'
            fill='#BABEC9'
        />
        <path
            d='M290.375 91.3414L210.079 171.375L191.375 152.475L274.944 75.75L290.375 91.3414Z'
            fill='#363A45'
        />
        <path
            d='M287.297 107.25L230.75 165.166L245.906 180.375L300.5 120.492L287.297 107.25Z'
            fill='white'
        />
        <path
            d='M255.101 160.078C251.985 157.081 253.832 151.457 254.967 148.394C256.725 143.645 258.577 152.757 258.666 154.169C258.965 158.8 258.575 163.45 257.512 167.956C256.915 170.484 256.042 172.932 254.91 175.251C254.231 176.683 253.256 177.94 252.055 178.931C249.073 180.814 247.176 178.984 246.409 173.454C246.719 171.764 247.495 170.205 248.642 168.971C252.537 163.911 258.698 161.358 263.234 157.432C263.678 157.041 262.968 156.311 262.53 156.689C257.131 161.378 246.034 165.244 245.4 174.508C244.943 180.629 250.888 181.942 254.073 178.533C258.216 174.104 259.275 166.033 259.631 159.965C259.84 156.444 260.697 146.703 255.748 145.522C255.653 145.49 255.55 145.493 255.456 145.53C255.363 145.567 255.284 145.637 255.234 145.728C253.273 149.329 250.469 156.875 254.523 160.788C254.563 160.85 254.616 160.902 254.678 160.939C254.741 160.976 254.81 160.997 254.882 161.002C254.953 161.006 255.025 160.993 255.09 160.963C255.156 160.934 255.215 160.889 255.261 160.832C255.307 160.775 255.341 160.708 255.358 160.635C255.375 160.562 255.376 160.486 255.36 160.413C255.345 160.34 255.313 160.272 255.268 160.214C255.223 160.156 255.166 160.109 255.101 160.078Z'
            fill='#505667'
        />
        <path
            d='M262.517 157.469C267.035 160.015 268.152 149.876 267.565 147.113C267.543 147.031 267.502 146.955 267.445 146.894C267.388 146.832 267.317 146.786 267.238 146.76C267.159 146.734 267.075 146.728 266.993 146.744C266.912 146.759 266.835 146.795 266.771 146.849C264.402 148.781 263.982 153.874 265.996 156.835C266.036 156.911 266.095 156.975 266.167 157.019C266.239 157.063 266.322 157.086 266.406 157.086C266.49 157.086 266.573 157.063 266.645 157.019C266.717 156.975 266.776 156.911 266.816 156.835C268.115 154.09 269.213 151.25 270.102 148.34C270.502 147.113 271.541 147.396 272.361 146.545C274.027 144.817 275.647 143.063 277.28 141.348C279.339 139.171 280.049 136.302 281.954 134.092C284.381 131.308 286.718 129.963 287.931 126.13C288.209 125.253 288.228 123.222 286.75 123.109C283.91 122.885 281.411 129.046 285.207 128.439C289.849 127.72 294.012 122.199 297.02 119.264C297.382 118.914 296.717 118.241 296.375 118.604C294.877 120.062 293.341 121.513 291.746 122.912C290.476 124.033 289.149 125.086 287.77 126.064C287.066 126.559 281.76 128.954 285.13 124.93L286.924 126.355C286.737 126.861 286.521 127.357 286.279 127.839C285.826 128.731 285.294 129.578 284.691 130.372C283.58 131.922 281.818 132.825 280.559 134.263C278.958 136.097 278.332 138.716 276.622 140.629C275.866 141.473 271.735 146.869 270.263 146.229C270.169 146.195 270.067 146.197 269.975 146.236C269.883 146.275 269.808 146.348 269.766 146.44C269.288 147.832 268.824 149.237 268.352 150.648C268.184 151.163 266.222 155.173 266.28 155.312C265.539 153.168 265.594 150.821 266.435 148.715C266.71 149.232 266.875 149.803 266.918 150.39C266.961 150.976 266.883 151.566 266.687 152.119C266.358 154.619 265.112 156.116 262.962 156.578C262.905 156.548 262.842 156.53 262.778 156.525C262.714 156.52 262.65 156.527 262.589 156.548C262.528 156.568 262.471 156.6 262.422 156.643C262.373 156.685 262.333 156.737 262.304 156.796C262.274 156.854 262.257 156.918 262.252 156.983C262.246 157.049 262.254 157.115 262.274 157.177C262.294 157.24 262.325 157.298 262.367 157.348C262.409 157.398 262.459 157.439 262.517 157.469Z'
            fill='#505667'
        />
        <defs>
            <clipPath id='clip_payment_failed'>
                <rect
                    width='257'
                    height='219'
                    fill='white'
                    transform='translate(0.5 28)'
                />
            </clipPath>
        </defs>
    </svg>

);

export default PaymentFailedSvg;
